<div class="tablesize roles" style="margin: 0px 4px">
    <table id="scriptModel" lay-filter="scriptModel" lay-data="{id:'idTest'}"></table>
</div>

<script type="text/html" id="headerToolsBar">
    <div class="layui-btn-container">
        <a class="layui-btn layui-btn-sm" lay-event="query">
            <i class="layui-icon layui-icon-search"></i>
            <span>查询</span>
        </a>
        <a class="layui-btn layui-btn-sm" lay-event="reset">
            <i class="layui-icon layui-icon-search"></i>
            <span>重置</span>
        </a>
    </div>
    <form class="layui-form" action="" lay-filter="modelQueryForm" style="margin-top:10px">
        <div class="table-top-filter">
            <div class="table-filter-alone">
                <label class="layui-form-label" style="width: auto">脚本所在类的类名:</label>
                <input type="text" name="Q_className_SL" id="className" class="layui-input filter-value" style="width: 160px"/>
            </div>
            <div class="table-filter-alone" style="margin-left: 10px">
                <label class="layui-form-label">方法名:</label>
                <input type="text" name="Q_methodName_SL" id="methodsName" class="layui-input filter-value" style="width: 160px"/>
            </div>
            <div class="table-filter-alone" style="margin-left: 56px">
                <label class="layui-form-label" style="width: auto">方法描述:</label>
                <input type="text" name="Q_methodDesc_SL" id="methodsDescribed" class="layui-input filter-value" style="width: 160px"/>
            </div>
            <div class="table-filter-alone" style="margin-top: 4px">
                <label class="layui-form-label" style="width: auto">是否有效:</label>
                <select type="text" name="Q_enable_L" id="validity" class="layui-input filter-value" >
                    <option value="">全部</option>
                    <option value="0">是</option>
                    <option value="1">否</option>
                </select>
            </div>
        </div>
    </form>
    <div class="layui-btn-container" style="position: absolute;top: 415px;left: 42%">
        <button type="button" class="layui-btn" style="margin-bottom: 0px" lay-filter="varForm" id="save" lay-event="getCheckData">选择</button>
        <button type="button" class="layui-btn layui-btn-danger" style="margin-bottom: 0px;margin-right: 0px" id="closeChoose" >取消</button>
    </div>
</script>



<script>
    layui.use(['table', 'layer', 'form', 'util','common'], function () {
        var setter = layui.setter;
        var table = layui.table;
        var layer = layui.layer;
        var form = layui.form;
        var common = layui.common;
        var hiddenJson = 'return ';
        var showTxt    = '';
        table.render({
            elem: '.tablesize #scriptModel'
            , url: serverPath.workflowPath + setter.workflowLinkPath + 'personScript/selector'
            , method: 'post'
            , toolbar: '#headerToolsBar'
            , height: 400
            , page: false
            , cols: [[
                {type: 'radio', fixed: 'left',width: 40}
                ,{field: 'id', title: 'ID', sort: true, hide: true}
                ,{field: 'methodName', title: '方法名', align: 'center' }
                ,{field: 'methodDesc', title: '方法描述', align: 'center'}
                ,{field: 'className', title: '脚本所在类的类名', align: 'center',padding:0}
                ,{field: 'classInsName', title: '类实例名', align: 'center'}
                ,{field: 'enable', title: '是否生效', align: 'center',templet: function(d){
                        if (d.enable == 0){
                            return '<span style="color: green">是</span>'
                        }else {
                            return '<span style="color: red">否</span>'
                        }
                    }}
            ]]
        });

        //查询按钮
        table.on('toolbar(scriptModel)',function(obj) {
            var checkStatus = table.checkStatus(obj.config.id);
            var data = checkStatus.data; //获取选中行数据
            switch (obj.event) {
                case 'query':
                    common.tableConditionRender("scriptModel", "modelQueryForm", {where: {}}, false);
                    break;
                case 'reset':
                    common.tableConditionRender("scriptModel","modelQueryForm",{where:{}},true);
                    break;
            }
        });

        //关闭弹窗
        $(document).on('click', '#closeChoose', function () {
            layer.close($("input[name=index]").val());
            return false;
        });
        //人员脚本选择弹窗  “保存”功能按钮
        //保存
        $(".layui-btn-container #save").click(function () {
            var checkStatus;
            table.on('toolbar(scriptModel)', function (obj) {
                checkStatus = table.checkStatus(obj.config.id); //获取选中行状态
                switch (obj.event) {
                    case 'getCheckData':
                        var data = checkStatus.data;  //获取选中行数据
                        $("input[name=condScriptId]").val(data[0].id);
                        $("input[name=condScriptName]").val(data[0].methodDesc);
                        $("input[name=methodName]").val(data[0].methodName);
                        $("input[name=classInsName]").val(data[0].classInsName);
                        //获取JSON数据，并转换格式
                        var jsonStr = eval(data);
                        //存储JSON数据
                        var json;
                        //获取特定的JSON数据
                        for (var i = 0; i < jsonStr.length; i++) {
                            for (var key in jsonStr[i]) {
                                if (key == 'argument') {
                                    json = eval(jsonStr[i][key]);
                                    break;
                                }
                            }
                        }
                        //渲染表格
                        table.render({
                            elem: '#demo' //指定原始表格元素选择器（推荐id选择器）
                            , height: 315 //容器高度
                            , data: json
                            ,id:'idTest'
                            , cols: [[
                                {field: 'paraName', sort: true, align: 'center', title: '参数名称',width:110}
                                , {field: 'paraType', align: 'center', title: '参数类型',width:110}
                                , {field: 'paraDesc', align: 'center', title: '参数说明',width:110}
                                , {field: 'paraCt', align: 'center', title: '参数值', templet:
                                        function (d) {
                                            return '<select name="paraCt" lay-filter="ctSelect" lay-verify="required"><option value="1">流程变量</option><option value="2">固定值</option></select>'
                                                +'<select name="paraCtType" class="paraCtType" lay-filter="ctTypeSelect" lay-verify="required"><option value="startUser">发起人ID</option><option value="businessKey">表单主键</option><option value="flowRunId">流程运行ID</option></select>'
                                                + '<input type="hidden" name="paraValID" lay-filter="ctTypeInput" lay-verify="required" class="layui-input" id="paraValID" >';
                                        }
                                }
                            ]]
                        });
                        table.resize('idTest');
                        form.render("select");
                        layer.close($("input[name=index]").val());
                }
            });
        });

    })
</script>
<style>
    .tablesize .layui-table-view .layui-table{
        width: 100%;
    }
</style>

